<template>
  <div>
    <div>
    </div>
    <div>
      <el-table :data="users.slice((currentPage-1)*pagesize,currentPage*pagesize)" border stripe
                @selection-change="selsChange">
        <el-table-column label="序号" prop="cid"/>
        <el-table-column label="业主" prop="owner.oname"/>
        <el-table-column label="楼栋" prop="tower.tname"/>
        <el-table-column label="月份" prop="month.mname"/>
        <el-table-column label="订单编号" prop="contractnum"/>
        <el-table-column label="内容" prop="content"/>
        <el-table-column label="合同日期" prop="contracttime"/>
        <el-table-column label="合同金额" prop="expire"/>
        <el-table-column label="到期日期" prop="time"/>
        <el-table-column label="状态" prop="state"/>
        <el-table-column label="已付金额" prop="money"/>
      </el-table>
    </div>
    <div class="pagei">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[3, 6, 9, 12]"
        :page-size="pagesize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  name: 'vue1',
  data () {
    return {
      schArr: [], // 分页数据源
      pagesize: 3,
      currentPage: 1,
      total: 0,
      tableData: [],
      search: '',
      activeName: 'a',
      radio: '1',
      users: {},
      ruleForm: {
        tableData: [],
        search: '',
        dialogVisible: false,
        dialogUpdate: false,
        pageSize: 3,
        currentPage: 1,
        total: 0,
        disablePage: false
      }
    }
  },
  created () {
    const that = this
    this.getPages()
    // this.getPages();
    this.axios.post('http://localhost:8001/')
      .then(function (response) {
        console.log(response)
        that.users = response.data
      })
  },
  methods: {
    handleSizeChange (val) {
      this.getPageData()
      var s = this
      console.log(`每页 ${val} 条`)
      s.pagesize = val
      s.getPageData()
      console.log(s.pagesize)
    },
    handleCurrentChange (val) {
      this.getPageData()
      var ss = this
      console.log(`当前页: ${val}`)
      ss.currentPage = val
      ss.getPageData()
      console.log(ss.currentPage)
    },
    getPageData () {
      console.log('是否yes')
      var thats = this
      let start = (this.currentPage - 1) * this.pagesize
      let end = start + this.pagesize
      this.schArr = thats.users.slice(start, end)
      this.total = thats.users.length
    },
    getPages () {
      this.axios.post('http://localhost:8001/getCount').then(response => {
        this.total = response.data
      }).catch(error => {
        console.log(error)
      })
    }
  }
}
</script>

<style scoped>

</style>
